<apes-header>
  <apes-button-list class="buttonList" [ctx]="ctx" [buttonBarMetadata]="buttonBar"
                    (click)="onEvent($event)"></apes-button-list>
</apes-header>
<div class="generalLedger">

  <apes-content [relevancy]="relevancyMetadata">
    <!--<p [ngStyle]="{ display: hidn }"><i class="anticon anticon-exclamation-circle-o"></i> 必填！选项不能为空 </p>-->

    <div class="boxShowFlex" style="background:white;margin:0px 8px 8px">
      <!-- 公司名称 -->
      <div apes-col apesSpan="12">
        <span class="span">公司：</span>
        <ng-select style="width: 320px; display: inline-block" required="true"
                   [items]="company"
                   bindLabel="name"
                   bindValue="id"
                   [placeholder]="'请选择公司'" [(ngModel)]="companyId" (change)="test()" [notFoundText]="'无法找到'"
                   [searchFn]="customSearchFn"
                   typeToSearchText>
        </ng-select>
      </div>

      <!-- 财务科目 -->
      <!--财务科目-->
      <div apes-col apesSpan="12">
        <span class="span">财务科目：</span>
        <ng-select style="width: 320px; display: inline-block" required="true"
                   [items]="account"
                   bindLabel="name"
                   bindValue="id"
                   clearAllText [placeholder]="'请选择财务科目'" [(ngModel)]="acc" [searchFn]="customSearchFn"
                   [notFoundText]="'无法找到'" typeToSearchText>
        </ng-select>
      </div>
      <!-- 财务科目级别 -->
      <!--财务科目级别-->
      <div apes-col apesSpan="12">
        <span class="span">财务科目级别(起)：</span>
        <ng-select style="width: 130px; display: inline-block" required="true"
                   [items]="accountClasses"
                   bindLabel="key"
                   bindValue="key"
                   clearAllText [placeholder]="'财务科目级别'" [(ngModel)]="classes"
                   [notFoundText]="'无法找到'" typeToSearchText>
        </ng-select>
      </div>
      <!-- 财务科目级别 -->
      <!--财务科目级别-->
      <div apes-col apesSpan="12">
        <span class="span">财务科目级别(至)：</span>
        <ng-select style="width: 130px; display: inline-block" required="true"
                   [items]="accountClasses"
                   bindLabel="key"
                   bindValue="key"
                   clearAllText [placeholder]="'财务科目级别'" [(ngModel)]="stopClasses"
                   [notFoundText]="'无法找到'" typeToSearchText>
        </ng-select>
      </div>
      <!--财务年度(起)-->
      <div apes-col apesSpan="12">
        <span class="span">财务年度(起)：</span>
        <ng-select style="width: 130px; display: inline-block" required="true"
                   [items]="year"
                   bindLabel="year"
                   bindValue="year"
                   clearAllText [placeholder]="'请选择财务年度'" [(ngModel)]="yearId" (change)="invokPeriod()"
                   [notFoundText]="'无法找到'" typeToSearchText>
        </ng-select>
      </div>
      <!-- 会计期间(起)-->
      <div apes-col apesSpan="12">
        <span class="span">会计期间(起)：</span>
        <ng-select style="width: 130px; display: inline-block"
                   [items]="period"
                   bindLabel="period_name"
                   bindValue="yearMonth" required="true"
                   clearAllText [placeholder]="'请选择会计月份'" [(ngModel)]="periodId" [notFoundText]="'无法找到'"
                   typeToSearchText>
        </ng-select>
      </div>
      <!--财务年度（止）-->
      <div apes-col apesSpan="12">
        <span class="span">财务年度(止)：</span>
        <ng-select style="width: 130px; display: inline-block"
                   [items]="year"
                   bindLabel="year"
                   bindValue="year" required="true"
                   clearAllText [placeholder]="'请选择财务年度'" [(ngModel)]="stopYearId" (change)="invokStopPeriod()"
                   [notFoundText]="'无法找到'" typeToSearchText>
        </ng-select>
      </div>


      <!-- 会计期间(止)-->
      <div apes-col apesSpan="12">
        <span class="span">会计期间(止)：</span>
        <ng-select style="width: 130px; display: inline-block" required="true"
                   [items]="stopPeriod"
                   bindLabel="period_name"
                   bindValue="yearMonth"
                   clearAllText [placeholder]="'请选择会计月份'" [(ngModel)]="stopPeriodId"
                   [notFoundText]="'无法找到'"
                   typeToSearchText>
        </ng-select>
      </div>

      <!--<div apes-col apesSpan="24" style="text-align: center">-->
      <!--<label apes-col apesSpan="8" apes-checkbox (loadstart)="" )="test()" [(ngModel)]="flag">是否显示辅助核算项</label>-->
      <!--</div>-->


    </div>
    <div style="padding: 0 8px">
      <ag-grid-angular #grid
                       style="width: 100%;" class="ag-theme-balham"
                       enableColResize="true"
                       enableSorting="true"
                       suppressLoadingOverlay="true"
                       [modules]="modules"
                       [rowData]="rowData"
                       [gridOptions]="gridOptions"
                       [columnDefs]="columnDefs"
                       [localeText]="localeText"
      >
      </ag-grid-angular>
    </div>
  </apes-content>

</div>
